﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="myfavorphoto.aspx.cs" Inherits="myfavorphoto" MasterPageFile="~/Global.master"%>
<asp:Content ID="Content1" ContentPlaceHolderID="g_style" runat="server">
    <link href="Styles/albumshow.css" rel="stylesheet" type="text/css" />
    <link href="Styles/fall.css" rel="stylesheet" type="text/css" />
    <script src="Scripts/jquery.masonry.min.js" type="text/javascript"></script>
    <script src="Scripts/jquery.infinitescroll.min.js" type="text/javascript"></script>
    <script type="text/javascript">
        ISLOGIN = true;
        newMessagetimer = null;
        newMessagetimerInterval = 120000;
        $(document).ready(function () {
            $('.userBoard').hover(
						    	        function () {
						    	            var timeId = setTimeout(function () {
						    	                $('.userBoard').addClass("userBoardActive");
						    	                //$('.userMenu').slideDown('normal');
						    	                $('.userMenu').show();
						    	            }, 100);
						    	            $(this).data('timeId', timeId);
						    	        },
						    	        function () {
						    	            clearTimeout($(this).data('timeId'));
						    	            $('.userMenu').slideUp('fast', function () {
						    	                $('.userBoard').removeClass("userBoardActive");
						    	            });
						    	        }
					    	        );
            if (ISLOGIN) {
                newMessagetimer = window.setTimeout(getNewMessage, newMessagetimerInterval);
            }
        });
        function getNewMessage() {
            if (newMessagetimer) {
                window.clearTimeout(newMessagetimer);
            }
            newMessagetimer = null;
            var url = BASEULR + "/user/newmessage";
            $.getJSON(url, function (res) {
                if (res.state == 'ok') {
                    setNewMessage(res.message);
                    newMessagetimer = window.setTimeout(getNewMessage, newMessagetimerInterval);
                } else if (res.state == 'notlogin') {
                    ISLOGIN = false;
                } else {
                }
            });
        }
        function setNewMessage(newMessage) {
            var newMessageNum = parseInt(newMessage);
            if (newMessageNum > 0) {
                if ($('.header .newMessagetip').length > 0) {
                    $('.header .newMessagetip').html(newMessage);
                } else {
                    $('.header .userBoard').after('<a class="newMessagetip" href="/user/message">' + newMessage + '</a>');
                }
            } else {
                if ($('.header .newMessagetip').length > 0) {
                    $('.header .newMessagetip').remove();
                }
            }
        }
	</script>
    <!--ajax加载-->
    <script type="text/javascript">
        var index = <%=uid %>
        var type="favor";
        function Submit() {
            $.post('Server.aspx',
             { index: index ,type : type},
              function (result) {
                  var obj = eval("(" + result + ")");
                  InsertPic(obj);
                  
              });
        }
        function InsertPic(objPic) {
            var contentDiv = $("#Div2");
            for (var i = 0; i < objPic.length; i++) {
                var newDiv = '<div class="box showpic"><div class="picbox"><a href="photo.aspx?pid='+objPic[i].Pid +'" target="_blank"><img height="150" width="150" alt='+objPic[i].Desp+' class="txpic" src=' + objPic[i].Pic + ' style="display: block;"></a></div><p>' + objPic[i].Desp + '</p><div class="actions"><div class="lefter"><a class="button white" href="#">评论</a></div><div class="righter"><a class="button white" href="#">收藏</a><a class="button white" href="#">分享</a></div></div></div>';
                //contentDiv.append(newDiv);
                var $boxes = $(newDiv);
                $('#container').append($boxes).masonry('appended', $boxes);
            }
        }
    </script>
    <!--判断是否滚轮到底-->
    <script type="text/javascript">
        $(function () {
            $(window).scroll(function () {
                // 当滚动到最底部以上100像素时， 加载新内容
                if ($(document).height() - $(this).scrollTop() - $(this).height() < 100) {
                    Submit();
                }
            });
        });
    </script>
    <!-- 初始加载 -->
    <script type="text/javascript">
        $(function () {
            var $container = $('#container');
            $container.imagesLoaded(function () {
                $container.masonry({
                    itemSelector: '.box',
                    columnWidth: 5 //每两列之间的间隙为5像素
                });
            });

            $container.infinitescroll({
                navSelector: '#page-nav',    // 选择的分页导航 
                nextSelector: '#page-nav a',  // 选择的下一个链接到（第2页）
                itemSelector: '.box',     // 选择检索所有项目
                loading: {
                    finishedMsg: '没有更多的页面加载。',
                    img: 'images/loading.gif'
                }
            }, function (newElements) {

                // 隐藏新的项目，而他们正在加载
                var $newElems = $(newElements).css({ opacity: 0 });

                // 确保的图像装载增加砖石布局
                $newElems.imagesLoaded(function () {

                    // 元素展示准备
                    $newElems.animate({ opacity: 1 });
                    $container.masonry('appended', $newElems, true);

                });
            }
	);

            $('<a href="#" id="retop">返回顶部</a>').appendTo('body').fadeOut().click(function () {
                $(document).scrollTop(0);
                $(this).fadeOut();
                return false
            });
            var $retop = $('#retop');
            function backTopLeft() {
                var btLeft = $(window).width() / 2 + 478;
                if (btLeft <= 950) {
                    $retop.css({ 'left': 955 })
                } else {
                    $retop.css({ 'left': btLeft })
                }
            }
            backTopLeft();
            $(window).resize(backTopLeft);
            $(window).scroll(function () {
                if ($(document).scrollTop() === 0) {
                    $retop.fadeOut()
                } else {
                    $retop.fadeIn()
                }
                if ($.browser.msie && $.browser.version == 6.0 && $(document).scrollTop() !== 0) {
                    $retop.css({ 'opacity': 1 })
                }
            });

        });
    </script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="g_ihead" runat="server">
    <h1>我收藏的图片</h1>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="g_left" runat="server">
    <div class="photos">
        <div id="container" class="transitions-enabled infinite-scroll clearfix">
           <%=this.pic_init %> 
        </div>
       <div class="iftloadingbox"></div>
       <div class="clickformore" style="display:none;">加载更多</div>
    </div>
    <div class="clearBoth"></div>
</asp:Content>